<template>
  <Layout :class="prefixCls" v-bind="lockEvents">
    <LayoutContent />
    <LayoutFooter />
  </Layout>
</template>
<script setup>
  import { Layout } from 'ant-design-vue';
  import LayoutContent from '/@/layouts/default/content/index.vue';
  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
  import { useDesign } from '/@/hooks/web/useDesign';
  const LayoutFooter = createAsyncComponent(() => import('/@/layouts/default/footer/index.vue'));
  const { prefixCls } = useDesign('simple-layout');
</script>
<style lang="less">
  @prefix-cls: ~'@{namespace}-simple-layout';

  .@{prefix-cls} {
    display: flex;
    width: 100%;
    min-height: 100%;
    background-color: @content-bg;
    flex-direction: column;

    > .ant-layout {
      min-height: 100%;
    }

    &-main {
      width: 100%;
      margin-left: 1px;
    }
  }
</style>
